<template>
  <el-container style="height: 500px; border: 1px solid #eee">
    <el-container>
      <el-aside class="el-aside" width="200px" style="background-color: #19374b">
        <v-menu/>
      </el-aside>
      <el-main class="elMain">
        <!-- 标题 -->
        <el-row class="lineHight90 margin060">
          <el-breadcrumb separator=">">
            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
            <el-breadcrumb-item :to="{ path: '/' }">买家中心</el-breadcrumb-item>
            <el-breadcrumb-item>需求管理</el-breadcrumb-item>
          </el-breadcrumb>
        </el-row>
       <!-- 需求基本信息 -->
        <el-row class="margin060 navtiveTop bgWhite">
          <el-col :span="12">
            <el-row>
              <el-col :span="18" :offset="6">
                <el-row class="marginTB45 borderRight">
                  <el-col :span="8">
                    <div class="width169 imgContains">
                      <img src="../../assets/images/buyerHeadImg.png" alt="">
                    </div>
                  </el-col>
                  <el-col :span="13">
                    <el-row class="companyTitle lineHeight28">苏州雅观科技有限公司</el-row>
                    <el-row class="companyYear"> <i class="iconfont icondizhi1 colorPrimary"></i> 苏州市&nbsp;&nbsp;5年行内经验</el-row>
                    <el-row class="companyAddress lineHeight28">工厂地址&nbsp;&nbsp;苏州</el-row>
                    <el-row class="companySize lineHeight28">公司规模：团队50人以上 团队核心竞争力强</el-row>
                  </el-col>
                </el-row>
              </el-col>
            </el-row>
          </el-col>
          <el-col :span="12">
            <el-row>
              <el-col :span="18">
                <el-row class="marginTB45 paddingLeft84">
                  <el-col :span="13">
                    <el-row class="companyTitle lineHeight28">解决方案负责人</el-row>
                    <el-row class="companyYear" :gutter="20">
                      <el-col :span="6">
                        <div class="size60 imgContains">
                          <img src="../../assets/images/userImg.png" alt="">
                        </div>
                      </el-col>
                      <el-col :span="12">
                        <el-row class="font20 color333">何向东</el-row>
                        <el-row class="font16  marginTop12 ">项目负责人</el-row>
                      </el-col>
                    </el-row>
                  </el-col>
                </el-row>
              </el-col>
            </el-row>
          </el-col>
        </el-row>
         <!-- 苏州2.5产业园储能项目 -->
         <el-row class="margin060">
           <el-col :span="24" class="itemTitle textCenter">
             苏州2.5产业园储能项目
           </el-col>
           <el-col>
             <el-row class="navtiveTop">
               <el-col :span="24">
                 <el-row class="bgfcfcfc">
                   <el-col :span="20" class="bgWhite">
                     <el-row class="lineHeight69 boderBottom">
                       <el-col :span="2" :offset="1" class="font16 col333">项目类型：</el-col>
                       <el-col :span="21" class="colc1 font14">为推动城市治理水平提升，利用物联网、人工智能、5G、高精定位、AR、边缘计算、大数据等技术</el-col>
                     </el-row>
                     <el-row class="lineHeight69 boderBottom">
                       <el-col :span="2" :offset="1" class="font16 col333">专业类型：</el-col>
                       <el-col :span="21" class="colc1 font14">加快城市设施互联，通过城市大数据高效协同城市管理者与基础设施，实现城市治理智能化。 </el-col>
                     </el-row>
                     <el-row class="lineHeight69 boderBottom">
                       <el-col :span="2" :offset="1" class="font16 col333">需求说明：</el-col>
                       <el-col :span="21" class="colc1 font14">加快城市设施互联，通过城市大数据高效协同城市管理者与基础设施，实现城市治理智能化。 诚邀合作伙伴与我们共创普惠方案，推动智能城</el-col>
                     </el-row>
                     <el-row class="lineHeight69 boderBottom">
                       <el-col :span="3" :offset="1" class="font16 col333">项目经济性分析  :</el-col>
                       <el-col :span="20" class="colc1 font14">项目经济性适中，有比较高的发展期望值......</el-col>
                     </el-row>
                   </el-col>
                   <el-col :span="4">
                     <el-row>
                       <el-col :span="20" :offset="2" class="marginTop85">
                        <el-button :span="24" type="success" class="width100 lineHeight55 btn47b7c2">成功按钮</el-button>
                       </el-col>
                     </el-row>
                   </el-col>
                 </el-row>
               </el-col>
             </el-row>
           </el-col>
            <el-col :span="24" class="bgWhite">
             <el-row class="padding10">
               <el-col :span="5" :offset="2" class="lineHeight60">
                 <el-radio-group v-model="chooseSupplier">
                  <el-radio :label="3">平台推荐供应商</el-radio>
                  <el-radio :label="6">关注的供应商</el-radio>
                </el-radio-group>
               </el-col>
               <el-col :span="8" :offset="1">
                 <el-row>
                   <el-col :span="9">
                    <el-button type="success" class="width100 lineHeight55">指定供应商对接</el-button>
                   </el-col>
                 </el-row>
               </el-col>
             </el-row>
             <!-- 供应商公司选择 -->
             <el-row class="padding10 bgWhite">
               <el-col :span="5" :offset="2">
                 <el-row>
                  <el-col :span="24" class="border">
                    <el-row class="padding20">
                      <el-col :span="8">
                        <div class="imgContains size110">
                          <img src="../../assets/images/companyLogo.png" alt="">
                        </div>
                      </el-col>
                      <el-col :span="16">
                        <el-row>
                          <el-col class="logoTitle font16 col333 paddingLeft15" :span="24">远景能源（江苏）有限公司</el-col>
                          <el-col class="logoAddress font14 colc1 paddingLeft15 lineHeight28" :span="24">企业位置：苏州</el-col>
                          <el-col class="logoAddress font14 colc1 paddingLeft15 lineHeight28" :span="24">远景能源（江苏）有限公司</el-col>
                        </el-row>
                      </el-col>
                    </el-row>
                    <el-row class="lineHeight28 bgFd padding20">
                      <el-col :span="7">综合评分：</el-col>
                      <el-col :span="12">
                        <el-rate
                          v-model="value5"
                          disabled
                          show-score
                          text-color="#ff9900"
                          >
                        </el-rate>
                      </el-col>
                    </el-row>
                  </el-col>
                </el-row>
               </el-col>
                <el-col :span="5" :offset="2">
                 <el-row>
                  <el-col :span="24" class="border">
                    <el-row class="padding20">
                      <el-col :span="8">
                        <div class="imgContains size110">
                          <img src="../../assets/images/companyLogo.png" alt="">
                        </div>
                      </el-col>
                      <el-col :span="16">
                        <el-row>
                          <el-col class="logoTitle font16 col333 paddingLeft15" :span="24">远景能源（江苏）有限公司</el-col>
                          <el-col class="logoAddress font14 colc1 paddingLeft15 lineHeight28" :span="24">企业位置：苏州</el-col>
                          <el-col class="logoAddress font14 colc1 paddingLeft15 lineHeight28" :span="24">远景能源（江苏）有限公司</el-col>
                        </el-row>
                      </el-col>
                    </el-row>
                    <el-row class="lineHeight28 bgFd padding20">
                      <el-col :span="7">综合评分：</el-col>
                      <el-col :span="12">
                        <el-rate
                          v-model="value5"
                          disabled
                          show-score
                          text-color="#ff9900"
                          >
                        </el-rate>
                      </el-col>
                    </el-row>
                  </el-col>
                </el-row>
               </el-col>
                <el-col :span="5" :offset="2">
                 <el-row>
                  <el-col :span="24" class="border">
                    <el-row class="padding20">
                      <el-col :span="8">
                        <div class="imgContains size110">
                          <img src="../../assets/images/companyLogo.png" alt="">
                        </div>
                      </el-col>
                      <el-col :span="16">
                        <el-row>
                          <el-col class="logoTitle font16 col333 paddingLeft15" :span="24">远景能源（江苏）有限公司</el-col>
                          <el-col class="logoAddress font14 colc1 paddingLeft15 lineHeight28" :span="24">企业位置：苏州</el-col>
                          <el-col class="logoAddress font14 colc1 paddingLeft15 lineHeight28" :span="24">远景能源（江苏）有限公司</el-col>
                        </el-row>
                      </el-col>
                    </el-row>
                    <el-row class="lineHeight28 bgFd padding20">
                      <el-col :span="7">综合评分：</el-col>
                      <el-col :span="12">
                        <el-rate
                          v-model="value5"
                          disabled
                          show-score
                          text-color="#ff9900"
                          >
                        </el-rate>
                      </el-col>
                    </el-row>
                  </el-col>
                </el-row>
               </el-col>
             </el-row>
           </el-col>
         </el-row>
         <el-row class="margin060">
           <el-col :span="24" class="itemTitle textCenter">
             苏州2.5产业园储能项目
           </el-col>
           <el-col>
             <el-row class="navtiveTop">
               <el-col :span="24">
                 <el-row class="bgfcfcfc">
                   <el-col :span="20" class="bgWhite">
                     <el-row class="lineHeight69 boderBottom">
                       <el-col :span="2" :offset="1" class="font16 col333">项目类型：</el-col>
                       <el-col :span="21" class="colc1 font14">为推动城市治理水平提升，利用物联网、人工智能、5G、高精定位、AR、边缘计算、大数据等技术</el-col>
                     </el-row>
                     <el-row class="lineHeight69 boderBottom">
                       <el-col :span="2" :offset="1" class="font16 col333">专业类型：</el-col>
                       <el-col :span="21" class="colc1 font14">加快城市设施互联，通过城市大数据高效协同城市管理者与基础设施，实现城市治理智能化。 </el-col>
                     </el-row>
                     <el-row class="lineHeight69 boderBottom">
                       <el-col :span="2" :offset="1" class="font16 col333">需求说明：</el-col>
                       <el-col :span="21" class="colc1 font14">加快城市设施互联，通过城市大数据高效协同城市管理者与基础设施，实现城市治理智能化。 诚邀合作伙伴与我们共创普惠方案，推动智能城</el-col>
                     </el-row>
                     <el-row class="lineHeight69 boderBottom">
                       <el-col :span="3" :offset="1" class="font16 col333">项目经济性分析  :</el-col>
                       <el-col :span="20" class="colc1 font14">项目经济性适中，有比较高的发展期望值......</el-col>
                     </el-row>
                   </el-col>
                   <el-col :span="4">
                     <el-row>
                       <el-col :span="20" :offset="2" class="marginTop85">
                        <el-button :span="24" type="success" class="width100 lineHeight55 btn47b7c2">成功按钮</el-button>
                       </el-col>
                     </el-row>
                   </el-col>
                 </el-row>
               </el-col>
             </el-row>
           </el-col>
            <el-col :span="24" class="bgWhite">
             <el-row class="padding10">
               <el-col :span="5" :offset="2" class="lineHeight60">
                 <el-radio-group v-model="chooseSupplier">
                  <el-radio :label="3">平台推荐供应商</el-radio>
                  <el-radio :label="6">关注的供应商</el-radio>
                </el-radio-group>
               </el-col>
               <el-col :span="8" :offset="1">
                 <el-row>
                   <el-col :span="9">
                    <el-button type="success" class="width100 lineHeight55">指定供应商对接</el-button>
                   </el-col>
                 </el-row>
               </el-col>
             </el-row>
             <!-- 供应商公司选择 -->
             <el-row class="padding10 bgWhite">
               <el-col :span="5" :offset="2">
                 <el-row>
                  <el-col :span="24" class="border">
                    <el-row class="padding20">
                      <el-col :span="8">
                        <div class="imgContains size110">
                          <img src="../../assets/images/companyLogo.png" alt="">
                        </div>
                      </el-col>
                      <el-col :span="16">
                        <el-row>
                          <el-col class="logoTitle font16 col333 paddingLeft15" :span="24">远景能源（江苏）有限公司</el-col>
                          <el-col class="logoAddress font14 colc1 paddingLeft15 lineHeight28" :span="24">企业位置：苏州</el-col>
                          <el-col class="logoAddress font14 colc1 paddingLeft15 lineHeight28" :span="24">远景能源（江苏）有限公司</el-col>
                        </el-row>
                      </el-col>
                    </el-row>
                    <el-row class="lineHeight28 bgFd padding20">
                      <el-col :span="7">综合评分：</el-col>
                      <el-col :span="12">
                        <el-rate
                          v-model="value5"
                          disabled
                          show-score
                          text-color="#ff9900"
                          >
                        </el-rate>
                      </el-col>
                    </el-row>
                  </el-col>
                </el-row>
               </el-col>
                <el-col :span="5" :offset="2">
                 <el-row>
                  <el-col :span="24" class="border">
                    <el-row class="padding20">
                      <el-col :span="8">
                        <div class="imgContains size110">
                          <img src="../../assets/images/companyLogo.png" alt="">
                        </div>
                      </el-col>
                      <el-col :span="16">
                        <el-row>
                          <el-col class="logoTitle font16 col333 paddingLeft15" :span="24">远景能源（江苏）有限公司</el-col>
                          <el-col class="logoAddress font14 colc1 paddingLeft15 lineHeight28" :span="24">企业位置：苏州</el-col>
                          <el-col class="logoAddress font14 colc1 paddingLeft15 lineHeight28" :span="24">远景能源（江苏）有限公司</el-col>
                        </el-row>
                      </el-col>
                    </el-row>
                    <el-row class="lineHeight28 bgFd padding20">
                      <el-col :span="7">综合评分：</el-col>
                      <el-col :span="12">
                        <el-rate
                          v-model="value5"
                          disabled
                          show-score
                          text-color="#ff9900"
                          >
                        </el-rate>
                      </el-col>
                    </el-row>
                  </el-col>
                </el-row>
               </el-col>
                <el-col :span="5" :offset="2">
                 <el-row>
                  <el-col :span="24" class="border">
                    <el-row class="padding20">
                      <el-col :span="8">
                        <div class="imgContains size110">
                          <img src="../../assets/images/companyLogo.png" alt="">
                        </div>
                      </el-col>
                      <el-col :span="16">
                        <el-row>
                          <el-col class="logoTitle font16 col333 paddingLeft15" :span="24">远景能源（江苏）有限公司</el-col>
                          <el-col class="logoAddress font14 colc1 paddingLeft15 lineHeight28" :span="24">企业位置：苏州</el-col>
                          <el-col class="logoAddress font14 colc1 paddingLeft15 lineHeight28" :span="24">远景能源（江苏）有限公司</el-col>
                        </el-row>
                      </el-col>
                    </el-row>
                    <el-row class="lineHeight28 bgFd padding20">
                      <el-col :span="7">综合评分：</el-col>
                      <el-col :span="12">
                        <el-rate
                          v-model="value5"
                          disabled
                          show-score
                          text-color="#ff9900"
                          >
                        </el-rate>
                      </el-col>
                    </el-row>
                  </el-col>
                </el-row>
               </el-col>
             </el-row>
           </el-col>
         </el-row>
         <!-- 推荐供应商 -->
      </el-main>
    </el-container>
  </el-container>
</template>
<style scoped>
/* 储能项目开始 */
.itemTitle{
  line-height: 84px;
  color: #333333;
  font-size: 24px;
}
/* 储能项目结束 */

.companyAddress,.companySize{
  font-size: 16px;
  color: #c1c1c1;
}
.companyYear{
  font-size: 16px;
  color: #c1c1c1;
  margin: 26px 0;
}
.companyTitle{
  font-size: 20px;
  color: #666666;
  line-height: 26px;
}
.el-breadcrumb,
.el-breadcrumb__separator{
  line-height: 90px;
  font-size: 14px;
  color: #666666;
}
.el-breadcrumb__inner{
  font-size: 14px;
  color: #666666;
  font-weight: 500 !important;
}
.el-header {
  background-color: #b3c0d1;
  color: #333;
  line-height: 60px;
}
.elMain {
  right: 0;
  position: relative;
  padding: 0;
}
.el-container {
  border: 0 !important;
}
</style>
<script>
  import VMenu from '../../layout/default/components/menu'
export default {
  name: "Demand",
  components: {
    VMenu
  },
  data() {
    return{
      chooseSupplier: 3,//服务商选择
      value5: 3.7//评分
    }
  },
  methods: {
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    }
  }
};
</script>

